import React from 'react';
import { View, Text } from 'react-native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import Colors from '../shared/styling/Colors';

function MainScreen() {
  return <View style={{ backgroundColor: 'moccasin' }} />;
}

const Stack = createNativeStackNavigator();

export default function App() {
  return (
    <Stack.Navigator>
      <Stack.Screen
        name="Main"
        component={MainScreen}
        options={{
          headerLeft: () => <Text>a</Text>,
          headerTitle: () => <Text>b</Text>,
          headerRight: () => <Text>c</Text>,
          headerBackground: () => (
            <View
              style={{
                backgroundColor: Colors.PurpleLight80,
                width: '100%',
                height: 120,
              }}
            />
          ),
        }}
      />
    </Stack.Navigator>
  );
}